<!--  -->
<template>
  <div>
    <cu-custom
      :bgImage="bgImage"
      :needBack="true"
      bgColor="bgNormal"
      topTitle="我的申报"
      titleClass="commTitleWhite"
      backIconColor="#fff"
    ></cu-custom>
    <view class="content">
      <view class="declare_top">
        <view class="declare_top_tabs">
          <view
            @click="change(index)"
            class="item"
            :class="index == current ? 'active' : ''"
            v-for="(item, index) in list"
            :key="index"
          >
            <text class="name">{{ item["cate_name"] }}</text>
          </view>
        </view>
        <!-- <u-search
          placeholder="输入想要查找的内容"
          v-model="keyword"
          @click="handleClick"
          height="70"
          bg-color="#fff"
          border-color="#E0E0E0"
          placeholder-color="#dadada"
          :show-action="false"
          style="width: 100%"
          disabled
          :input-style="{
            paddingLeft: '110rpx',
          }"
        ></u-search> -->
      </view>
      <view class="item_container">
        <scroll-view
          scroll-y
          class=""
          @scrolltolower="loadMore"
          :style="{ height: scorllContentHeight }"
        >
          <view class="pd_30">
            <view
              class="item"
              v-for="(item, index) in declareList"
              :key="index"
              @click="toDetail(item)"
            >
              <view class="item_title">
                <view class="item_title_left">
                  <view class="assess-name">
                    {{ item.name }}
                  </view>
                 <view class="org-name">
                    组织名称：{{ item.socialOrganizationName }}
                  </view>
                </view>
                <view class="item_title_right">
                  {{ getTypeName(item.status) }}
                </view>
              </view>
              <view class="item_tags">
                <view class="status_image">
                  <view>
                    {{ item.socialOrganizationType }}
                  </view>
                  <view>
                    {{ item.level }}
                  </view>
                </view>
                <view class="" v-if="item.status == 4 || item.status == 5">
                  <image class="wtg" src="../../static/images/wtg.png" v-if="Number(item.recordScoreSum)<Number(item.levelPassMark)"> </image>
                  <image class="wtg" src="../../static/images/ytg.png" v-else-if="Number(item.recordScoreSum)>=Number(item.levelPassMark)"> </image>
                </view>
              </view>
            </view>
          </view>
          <u-loadmore
            :status="status"
            :load-text="loadText"
            v-if="declareList.length"
          ></u-loadmore>
          <!-- <view v-if="agreementList.length < 1" class="no-task">
          <image
            src="https://hklg.wincrosoft.net/yk-upload/lg/applet/agreement/no-agreement.png"
          ></image>
          <text>您还没有签署协议呢~</text>
        </view> -->
        </scroll-view>
      </view>
    </view>
    <u-calendar
      v-model="showCalendar"
      mode="range"
      @change="confirmDate"
    ></u-calendar>
  </div>
</template>

<script>
import { getMyDeclaration } from "@/api/report.js";
export default {
  data() {
    return {
      showCalendar: false, // 日历
      scorllContentHeight: "", // 页面滚动高度
      form: {
        size: 10,
        current: 1,
        // startDateStr: "",
        // endDateStr: "",
        status: "",
      },
      keyword: "", // 搜索框文字
      declareList: [],
      loadText: {
        loadmore: "加载更多",
        loading: "加载中",
        nomore: "没有更多了",
      },
      status: "loadmore",
      list: [
        {
          cate_name: "全部",
        },
        {
          cate_name: "填报中",
        },
        {
          cate_name: "结束",
        },
      ],
      current: 0,
      total: 0,
    };
  },
  onShow() {
    this.current = 0;
    // this.declareList = [];
    this.getHeight();
    // this.keyword =
    //   this.$moment().startOf("month").format("YYYY/MM/DD") +
    //   " ~ " +
    //   this.$moment().endOf("month").format("YYYY/MM/DD");
    // this.form.startDateStr = this.$moment().startOf("month").format("YYYY-MM-DD");
    // this.form.endDateStr = this.$moment().endOf("month").format("YYYY-MM-DD");
    this.getList();
  },
  methods: {
    getList() {
      getMyDeclaration(this.form).then((res) => {
        this.total = res.data.total;
        // console.log("res===", res);
        if (res.data.total > 10) {
          this.declareList = this.declareList.concat(res.data.records); //合并数组
        } else {
          this.declareList = res.data.records;
          this.status = "nomore";
        }
      });
    },

    getTypeName(id) {
      let list = [
        {
          id: 1,
          name: "未开始",
        },
        {
          id: 2,
          name: "填报中",
        },
        {
          id: 3,
          name: "专家评审",
        },
        {
          id: 4,
          name: "分数公示",
        },
        {
          id: 5,
          name: "已结束",
        },
      ];

      let result = list.find((item) => item.id == id);
      return result ? result.name : "";
    },
    // 动态计算滚动高度
    getHeight() {
      const query = uni.createSelectorQuery().in(this);
      query
        .select(".declare_top")
        .boundingClientRect((data) => {
          console.log(data);
          this.scorllContentHeight = `calc(100vh - ${this.CustomBar}px - ${data.height}px - 20rpx)`;
        })
        .exec();
    },
    change(index) {
      if (this.current == index) return;
      this.current = index;
      switch (this.current) {
        case 0:
          this.form.status = "";
          break;
        case 1:
          this.form.status = 2;
          break;
        case 2:
          this.form.status = 5;
          break;
      }
      this.declareList = [];
      this.form.current = 1;

      this.getList();
    },
    // 加载更多
    loadMore() {
      if (this.total > this.form.current * this.form.size) {
        this.status = "loading";
        this.form.current++;
        this.getList();
      } else {
        this.status = "nomore";
      }
    },
    // 详情
    toDetail(data) {
		console.log(data)
		// if (data.declarationInfoStatus == 1) {
		// 	uni.showToast({
		// 		title: "当前申报正在审核中，不可进行填报",
		// 		icon: "none",
		// 	});
		// 	return false
		// }
		
		// if (data.declarationInfoStatus == 2) {
		// 	uni.showToast({
		// 		title: "当前申报审核未通过，不可进行填报",
		// 		icon: "none",
		// 	});
		// 	return false
		// }
		// if(data.status != 2) {
		// 	uni.showToast({
		// 		title: "当前阶段不是填报期，不可进行填报",
		// 		icon: "none",
		// 	});
		// 	return false
		// }
	  uni.setStorageSync("applyId",data.id)
    uni.setStorageSync("declarationInfoId",data.declarationInfoId)
	  uni.setStorageSync("mySocialOrganizationTypeId",data.socialOrganizationId)
      uni.navigateTo({
        url: `./detail?id=${data.declarationInfoId}`,
      });
    uni.setStorageSync("status",data.status)
    },
    handleClick() {
      this.showCalendar = true;
    },
    confirmDate(data) {
      this.keyword =
        data.startDate.replaceAll("-", "/") +
        " ~ " +
        data.endDate.replaceAll("-", "/");
      this.form.startDateStr = data.startDate;
      this.form.endDateStr = data.endDate;
      this.getList();
    },
  },
  components: {},
};
</script>
<style lang="scss" scoped>
.content {
  font-size: 24rpx;
  color: #333;
  .declare_top {
    background: #fff;
    padding: 30rpx 30rpx 20rpx;
    .declare_top_tabs {
      font-size: 28rpx;
      color: #000;
      display: flex;
      view {
        padding-bottom: 13rpx;
        &:nth-child(n + 2) {
          margin-left: 65rpx;
        }
      }
      .active {
        color: #758eff;
        border-bottom: 8rpx solid #4575f7;
      }
    }
  }
  .item_container {
    .pd_30 {
      padding: 25rpx;
    }
    .item {
      background: #fff;
      border-radius: 8rpx;
      padding: 25rpx;
      margin-bottom: 25rpx;
      .item_title {
        display: flex;
        justify-content: space-between;
        align-items: center;
        .item_title_left {
          .assess-name {
            font-size: 28rpx;
            font-weight: 500;
          }
          .org-name {
            font-size: 24rpx;
            color: #999999;
          }
        }
        .item_title_right {
          padding: 10rpx 23rpx;
          background: #dde3f7;
          border: 1px solid #dde3f7;
          border-radius: 8rpx;
          color: #758eff;
        }
      }
      .item_tags {
        display: flex;
        margin-top: 29rpx;
        align-items: center;
        justify-content: space-between;
        .status_image {
          display: flex;

          view:first-child {
            border-radius: 8rpx;
            padding: 10rpx 20rpx;
            background: #ebfaf5;
            color: #5acdaa;
            margin-right: 13rpx;
          }
          view:last-child {
            border-radius: 8rpx;
            padding: 10rpx 28rpx;
            color: #fb5151;
            background: #faebeb;
          }
        }
        .wtg {
          height: 140rpx;
          width: 184rpx;
        }
      }
    }
  }
}
::v-deep {
  .u-load-more-wrap {
    margin: 10rpx 0 !important;
  }
}
</style>